<template>
  <div>
    <div class="modal">
      <div class="modal-bg"></div>
      <div class="modal-text">
        <div class="modal-title"> FBI WARNING</div>
        <h2>{{warnmessage}}</h2>
        <button class="cancel_go" @click="cancelgo">取消</button>
        <button class="yesgo" @click="yesgo">确定</button>
      </div>
    </div>
  </div>
</template>
<script type="text/babel">
  export default {
    name: 'WarnModal',
    props: {
      DELE_TYPE:{
        type:Number
      },
      delfenqu:{
        type:Function
      },
      delloudong:{
        type:Function
      },
      delldanyaun:{
        type:Function
      },
      dellouceng:{
        type:Function
      },
      delfangjian:{
        type:Function
      },
      WarnModalClose: {
        type: Function
      },
      warnmessage:{
        type:String
      },
      warnpushTo:{
        type:String
      }
    },
    data() {
      return {
      }
    },
    methods:{
      cancelgo(){
        this.WarnModalClose()
      },
      yesgo(){
        console.log(this.DELE_TYPE);
        this.$router.push({name: this.warnpushTo});
        this.WarnModalClose();
        if(this.DELE_TYPE === 1){
          this.delfenqu();
        }else if (this.DELE_TYPE === 2){
          this.delloudong()
        }else if (this.DELE_TYPE ===3){
          this.delldanyaun()
        } else if(this.DELE_TYPE ===4){
          this.dellouceng()
        }else if(this.DELE_TYPE === 5){
          this.delfangjian()
        }
      }
    },
    mounted(){
    }
  }
</script>
<style scoped>
  .yesgo{
    border: none;
    padding: 5px 15px;
    background: darkred;
    color: #ffffff;
    font-size: 1rem;
    outline: none;
    float: right;
    margin-right: 20px;
    border-radius: 5px;
  }
  .cancel_go{
    border: none;
    padding: 5px 15px;
    background: #ffffff;
    color: darkred;
    font-size: 1rem;
    outline: none;
    float: left;
    margin-left: 20px;
    border-radius: 5px;
  }
  .modal-text h2 {
    text-align: center;
    padding: 50px 0;
    width: 100%;
    font-size: 2em;
    float: left;
  }
  .modal-text {
    width: 20%;
    position: absolute;
    z-index: 99;
    background: #ffffff;
    /*height: 200px;*/
    padding-bottom: 20px;
    top: 50%;
    left: 40%;
    border-radius: 5px;
    overflow: hidden;
    margin-top: -100px;
  }
  .modal-title {
    width: 94%;
    padding: 0 3%;
    float: left;
    font-size: 1.5em;
    text-align: center;
    line-height: 50px;
    background: darkred;
    color: #ffffff;
  }
  .modal-title span {
    float: right;
  }
</style>
